// -----------------------------------
// vhouse style
// 基础变量：varibles
// -----------------------------------
.icon {
   width: 1em; height: 1em;
   vertical-align: -0.15em;
   fill: currentColor;
   overflow: hidden;
   margin-right: 2px;
}  
.login-icon{
	font-size: $fs40;
}
// -----------------------------------
// vhouse 公用组件(依次类推)
// 移动端边框1px
// 文章列表：vf-news
// 底部加载全部提示： vf-bootom-tips
// 底部快速入口： vf-footer
// -----------------------------------
.border,
.border-top,
.border-right,
.border-bottom,
.border-left,
.border-topbottom,
.border-rightleft,
.border-topleft,
.border-rightbottom,
.border-topright,
.border-bottomleft {
    position: relative;
}
.border::before,
.border-top::before,
.border-right::before,
.border-bottom::before,
.border-left::before,
.border-topbottom::before,
.border-topbottom::after,
.border-rightleft::before,
.border-rightleft::after,
.border-topleft::before,
.border-topleft::after,
.border-rightbottom::before,
.border-rightbottom::after,
.border-topright::before,
.border-topright::after,
.border-bottomleft::before,
.border-bottomleft::after {
    content: "";
    overflow: hidden;
    position: absolute;
}
/* border
 * 因，边框是由伪元素区域遮盖在父级
 * 故，子级若有交互，需要对子级设置
 * 定位 及 z轴
 */
.border::before {
    box-sizing: border-box;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    border: 1px solid $borderColor;
    transform-origin: 0 0;
}
.border-top::before,
.border-bottom::before,
.border-topbottom::before,
.border-topbottom::after,
.border-topleft::before,
.border-rightbottom::after,
.border-topright::before,
.border-bottomleft::before {
    left: 0;
    width: 100%;
    height: 1px;
}
.border-right::before,
.border-left::before,
.border-rightleft::before,
.border-rightleft::after,
.border-topleft::after,
.border-rightbottom::before,
.border-topright::after,
.border-bottomleft::after {
    top: 0;
    width: 1px;
    height: 100%;
}
.border-top::before,
.border-topbottom::before,
.border-topleft::before,
.border-topright::before {
    border-top: 1px solid $borderColor;
    transform-origin: 0 0;
}
.border-right::before,
.border-rightbottom::before,
.border-rightleft::before,
.border-topright::after {
    border-right: 1px solid $borderColor;
    transform-origin: 100% 0;
}
.border-bottom::before,
.border-topbottom::after,
.border-rightbottom::after,
.border-bottomleft::before {
    border-bottom: 1px solid $borderColor;
    transform-origin: 0 100%;
}
.border-left::before,
.border-topleft::after,
.border-rightleft::after,
.border-bottomleft::after {
    border-left: 1px solid $borderColor;
    transform-origin: 0 0;
}
.border-top::before,
.border-topbottom::before,
.border-topleft::before,
.border-topright::before {
    top: 0;
}
.border-right::before,
.border-rightleft::after,
.border-rightbottom::before,
.border-topright::after {
    right: 0;
}
.border-bottom::before,
.border-topbottom::after,
.border-rightbottom::after,
.border-bottomleft::after {
    bottom: 0;
}
.border-left::before,
.border-rightleft::before,
.border-topleft::after,
.border-bottomleft::before {
    left: 0;
}
@media (max--moz-device-pixel-ratio: 1.49), (-webkit-max-device-pixel-ratio: 1.49), (max-device-pixel-ratio: 1.49), (max-resolution: 143dpi), (max-resolution: 1.49dppx) {
    /* 默认值，无需重置 */
}
@media (min--moz-device-pixel-ratio: 1.5) and (max--moz-device-pixel-ratio: 2.49), (-webkit-min-device-pixel-ratio: 1.5) and (-webkit-max-device-pixel-ratio: 2.49), (min-device-pixel-ratio: 1.5) and (max-device-pixel-ratio: 2.49), (min-resolution: 144dpi) and (max-resolution: 239dpi), (min-resolution: 1.5dppx) and (max-resolution: 2.49dppx) {
    .border::before {
        width: 200%;
        height: 200%;
        transform: scale(.5);
    }
    .border-top::before,
    .border-bottom::before,
    .border-topbottom::before,
    .border-topbottom::after,
    .border-topleft::before,
    .border-rightbottom::after,
    .border-topright::before,
    .border-bottomleft::before {
        transform: scaleY(.5);
    }
    .border-right::before,
    .border-left::before,
    .border-rightleft::before,
    .border-rightleft::after,
    .border-topleft::after,
    .border-rightbottom::before,
    .border-topright::after,
    .border-bottomleft::after {
        transform: scaleX(.5);
    }
}
@media (min--moz-device-pixel-ratio: 2.5), (-webkit-min-device-pixel-ratio: 2.5), (min-device-pixel-ratio: 2.5), (min-resolution: 240dpi), (min-resolution: 2.5dppx) {
    .border::before {
        width: 300%;
        height: 300%;
        transform: scale(.33333);
    }
    .border-top::before,
    .border-bottom::before,
    .border-topbottom::before,
    .border-topbottom::after,
    .border-topleft::before,
    .border-rightbottom::after,
    .border-topright::before,
    .border-bottomleft::before {
        transform: scaleY(.33333);
    }
    .border-right::before,
    .border-left::before,
    .border-rightleft::before,
    .border-rightleft::after,
    .border-topleft::after,
    .border-rightbottom::before,
    .border-topright::after,
    .border-bottomleft::after {
        transform: scaleX(.33333);
    }
}

// -----------------------------------
// 文章列表
// 左右结构用类：vf-news-list_con-LR
// 三张图: vf-news-list_con-three
// -----------------------------------
.vf-news{
	margin-top: 0.133333rem;
	padding: 0 0.533333rem 1.293333rem 0.533333rem;
	overflow: hidden;
	&-list{
		width: 100%;
		&_con{
			padding: 0.4rem 0;
			.title{
				font-weight: 400;
				max-height: 1rem;
				overflow: hidden;
				font-size: $fs32;
				line-height: 0.533333rem;
				color: $vfTitleColor;
			}
			.title-tips{
				font-size: 0;
				@include block-height(0.533333rem);
				color: $vfTextColor;
				overflow: hidden;
				margin-top: 0.266667rem;
				span{
					font-size: $fs24;
					margin-right: 0.8rem;
					&:nth-child(3){
                        margin-right: 0;
                    } 
					display: inline-block;
					white-space: nowrap;
					&.news-scour{
						text-overflow: ellipsis;
						max-width: 8em;
					}
				}
			}
			//三张图片结构
			&-three{
				a{
					position: relative;
					display: block;
					.title{
						@include block-height(0.533333rem);
						white-space: nowrap;
						text-overflow: ellipsis;
					}
					.news-info{
						margin-top: 0.266667rem;
						overflow: hidden;
//						@include flexbox();
//						@include justify-content(space-between);
						 
						img{
						    float: left;
						    margin-left: 0.866666rem;
						     &:nth-child(1){
                                margin-left: 0 ;
                            } 
//							@include flex(0, 0, 26.9%);
							width: 2.4rem;
							height: 1.866667rem;
							object-fit: cover;
						}
					}
				}
			}
			// 左右结构
			&-LR{
				a{
					@extend %flexbox;
					@include justify-content(space-between);
					.news-info{
						@include flex (2,2,auto);
						.title{
							display: -webkit-box;
						    -webkit-box-orient: vertical;
						    -o-text-overflow: ellipsis;
						    text-overflow: ellipsis;
						    -webkit-line-clamp: 2;
						    word-break: break-word;
							padding-right: 0.4rem;
						}
					}
					.news-img{
						width: 2.506667rem;
						@include flex(0, 0, auto);
						overflow: hidden;
						img{
							display: block;
							height: 1.866667rem;
							margin: 0 auto;
						}
					}
				}
			}
		}
	}
}
// -----------------------------------
// 底部加载全部提示
// -----------------------------------
.vf-bottom-tps{
	width: 80%;
	margin: .8rem auto .4rem ;
	&_line{
		position: relative;
		width: 100%;
		border-top: 1px solid $borderColor;
		span{
			position: absolute;
			top:-10px;
			left: 50%;
			transform: translateX(-50%);
			width: max-content;
			font-size:  $fs24;
			color: $vfTextColor;
			font-weight: 600;
			padding: 0 0.533333rem;
			background: #fff;
		}
	}
}
// -----------------------------------
// 底部快速入口
// -----------------------------------
.vf-footer{
	z-index: 1;
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	width: 100%;
	height: 1.28rem;
	background: $colorWhite;
	overflow: hidden;
	ul{
		width: 100%;
		margin: 0.266667rem 0;
		height: 0.773333rem;
		@include flexbox;
		@include justify-content(center);
		li{
			@include align-self(center);
			width: 50%;
			border-right: 1px solid #f4f4f4;
			box-sizing: border-box;
			a{
				svg{
					color: $vfTitleColor	
				}
				display: block;
				font-size: $fs40;
				color: $vfTitleColor;
				text-align: center;
				&.on{
					svg{
						color: $mainColor
					}
					color: $mainColor;
				}
			}
		}
	}
}
// -----------------------------------
// Header [首页]
// -----------------------------------
.header{
	width: 100%;
	@include block-height(1.066667rem);
	overflow: hidden;
	&-list{
		margin: 0 0.533333rem;
		overflow-x: scroll;
		overflow-y: hidden;
		white-space: nowrap;
		ul{
			@extend %flexbox;
			width: 100%;
			li{
				font-size: $fs36;
				margin: 0 0.266667rem 0 0;
				a{
					@include flex();
					color: $vfTitleColor;
					&.active{
						font-weight: 400;
						color: $mainColor;
					}		
				}
			}
		}
	}
}

// -----------------------------------
// uese protocol [用户协议]
// -----------------------------------
.vf-user-protocol{
	margin: 0 0.533333rem;
	padding: 0.533333rem 0 1.293333rem 0;
	overflow: hidden;
	&_header,
	&_content{
		width: 100%;
		p{
			font-size: $fs30;
			line-height: 0.64rem;
			color: $vfTitleColor;
			text-indent: 2em;
		}
	}
	&_content {
		width: 100%;
		margin-top: 0.266667rem;
	}
}
// -----------------------------------
// login [用户登录]
// -----------------------------------
.vf-login{
	width: 100%;
	overflow: hidden;
	&_welcome{
		margin-top: 1.466667rem;
		text-align: center;
		color: $vfTitleColor;
		p{
			font-size:  $fs40;	
		}
		.tips{
			font-size: $fs24;
			line-height: 0.533333rem;
			margin-top: 0.666667rem;
			em{
				color: $vfUserpColor;
			}
		}
	}
	&_more{
		margin-top: 2.666667rem;
		text-align: center;
		p{
			font-size: $fs30;
			color: $vfTitleColor;
		}
		ul{
			@include flexbox;
			@include justify-content(space-between);
			width: 70%;
			margin: 0.533333rem auto 0; 
			li{
				width:1.333333rem;
				a{
					display: block;
					img{
						width: 100%;
						display: block;
					}
					p{
						margin-top: 0.133333rem;
						text-align: center;
						font-size: $fs24;
						color: $vfLoginMoreTColor;
					}
				}
			}
		}
	}
}

// -----------------------------------
// myconcern [我的关注]
// -----------------------------------
.vf-concern{
	padding: 0.266667rem 0;
	margin: 0 0.533333rem;
	&_list{
		width: 100%;
		padding: 0.4rem 0;
		overflow: hidden;
		a{
			display: block;
			.concern-pic{
				float: left;
				width: 79px;
				border: 1px solid $borderColor;
				margin-right: 0.533333rem;
				overflow: hidden;
				img{
					display: block;
					height: 79px;
					margin: 0 auto;
				}
			}
			.concern-info{
				overflow: hidden;
				color: $vfTitleColor;
				line-height: 0.533333rem;
				.title{
					font-size: $fs32;
					img{
						position: relative;
						top: -2px;
						width: 0.373333rem;
						height: 0.373333rem;
						margin-right: 2px;
					}
				}
				p{
					font-size: $fs32;
					margin-top: 0.266667rem;
					display: -webkit-box;
				    -webkit-box-orient: vertical;
				    -o-text-overflow: ellipsis;
				    text-overflow: ellipsis;
				    -webkit-line-clamp: 2;
				    word-break: break-word;
				    overflow: hidden;
				}
				.fans{
					margin-top: 0.266667rem;
					font-size: $fs24;
					color: $vfLoginMoreTColor;
				}
			}
		}
	}
}

// -------------------
// lyd
// -------------------

// -----------------------------------
// 用户中心
// -----------------------------------

.vf-user-login{
    padding: 0.666666rem 0rem 0.533333rem;
    background: #f6f6f6;
    &_img{
        margin: 0 auto;
        padding-bottom: 0.266666rem;
        width: 2.133333rem;
        height: 2.133333rem;
        img{
            width: 100%;
            height: 100%;
            border-radius: 50%;
        }
    }
    p{
        text-align: center;
        color: $vfTitleColor;
        font-size: $fs30;
        line-height: $fs40;
        span{
            color: #ff4e00;
        }
    }
}
.vf-user-list{
    padding-top: 0.533333rem;
    li{
        padding: 0px 0.533333rem;
       a{
           padding-left: 2.906666rem;
           display: block;
           color: $vfTextColor;
           font-size: $fs36;
           line-height: 1.333333rem;
           svg{
               width: 0.586666rem;
               height: 0.586666rem;
               
           }
       } 
    }
    .vf-user-login_success{
        color: $vfTitleColor !important;        
    }
}


// -----------------------------------
// 大V详情
// -----------------------------------
.vf-user-detail{
    position: relative;
    padding: 0.666666rem 0rem 0.533333rem;
    background: #f6f6f6;
    .concern{
        position: absolute;
        right: 0.533333rem;
        top: 1.36rem;
    }
    &_img{
        margin: 0 auto 0.266666rem;
        width: 2.133333rem;
        height: 2.133333rem;
        img{
            width: 100%;
            height: 100%;
        }
    }
    &_name{
        padding-bottom: 0.266666rem;
        text-align: center;
        color: $vfTitleColor;
        font-size: $fs30;
        line-height: $fs40;
        span{
            &:nth-child(3){
                padding-left: 0.133333rem;
                font-size: $fs24;
            }          
        }
        img{
            margin-bottom: 0.053333rem;
            width: 0.373333rem;
            height: 0.373333rem;
        }
    }
    p{
        padding: 0rem 0.533333rem;
        color: $vfTitleColor;
        font-size: $fs32;
        line-height: $fs40; 
    }
}
.concern{
    width: 1.946666rem;
    height: 0.746666rem;
    text-align: center;
    font-size: $fs30;
    color: #ff4e00;
    line-height: 0.746666rem; 
    border: 0.026666rem solid #ff4e00;
    border-radius: 0.106666rem;
    background: #fff;
    img{
        margin:0rem 0.053333rem 0.026666rem;
        width: 0.2rem;
        height: 0.2rem;
    }
    i{
        position: relative;
        width: 8px;
        height: 8px;
        margin-right: 6px;
        &:before{
            content:'';
            display: block;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%,-50%);
            width: 8px;
            height: 2px;
            background: $vfUserpColor;
        }
        &:after{
            content:'';
            display: block;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%,-50%);
            width: 2px;
            height: 8px;
            background: $vfUserpColor;
        }
    }
}
//- 文章列表 下的 全部观点
.vf-news-allview{
    padding: 0.4rem 0rem 0.266666rem;
    color: $vfTitleColor;
    font-size: $fs32;
    line-height: $fs40;
}


// -----------------------------------
// 绑定手机号
// -----------------------------------
.vf-binding-phone{
    padding: 0.666666rem 0.533333rem 0rem;
    overflow: hidden;
    p{
        margin-bottom: 0.533333rem;
        text-align: center;
        font-size: $fs24;
        line-height: $fs40;
        color: $vfTitleColor;
    }
    input{
        padding: 0.266666rem 0.373333rem;
        margin-bottom: 0.533333rem;
        width: 100%;
        display: block;
        font-size: $fs32;
        line-height: $fs40;
        background: #F6f6f6;
        box-sizing: border-box;
        border: 1px solid $borderColor;
    }
    &_number{
        width: 100%;
    }
    &_valigate,&_message{
        overflow: hidden;
        input{
            float: left;
            width: 62.7%;
        }
        span{
            float: right;
            width: 31.3%;
            height: 1.066666rem;
        }
    }
    &_valigate{
        span{
            background: #ccc;
        }
    }
    &_message{
        span{
            text-align: center;
            color: #FF4E00;
            font-size: $fs32;
            line-height: 1.066666rem;
            border: #FF4E00;
            border: 1px solid #FF4E00;
            border-radius: 0.106666rem;
        }
    }
}
.phone-btn{
	display: block;
	width: 100%;
    text-align: center;
    font-size: 0.533333rem;
    line-height: 1.066666rem;
    color: #fff;
    background: $vfUserpColor;
    border-radius: 0.106666rem;
    border: none;
}


// -----------------------------------
// 意见反馈  &&  发表评论
// -----------------------------------
.vf-suggest{
    padding:0.4rem 0.533333rem;
}
.vf-evaluate{
    padding: 0.533333rem;
    p{
        font-size: $fs32;
        line-height: $fs44;
        color: $vfTitleColor;
        margin-bottom: 0.266666rem;
    }
}
.textarea{
    padding: 0.266666rem 0.373333rem;
    margin-bottom: 0.533333rem;
    width: 100%;
    height: 2.933333rem;
    font-size: $fs32;
    line-height: $fs40;
    background: #F6f6f6;
    box-sizing: border-box;
    border: 1px solid $borderColor;
}

input,textarea{
    outline: none;
    -webkit-appearance: none; 
    -webkit-appearance: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
// -----------------------------------
// 详情页 lx 20180520
// -----------------------------------
.vf-detail{
	width: 100%;
	&_container{
		padding: 0  0.533333rem;
		// 头部
		&__header{
			padding: 0.4rem 0;
			.title{
				font-size: $fs36;
				color: $vfTitleColor;
				line-height: 0.533333rem;
				display: -webkit-box;
			    -webkit-box-orient: vertical;
			    -o-text-overflow: ellipsis;
			    text-overflow: ellipsis;
			    -webkit-line-clamp: 2;
			    word-break: break-word;
			    overflow: hidden;
			}
			@at-root .header-info{
				position: relative;
				@include flexbox;
				@include justify-content(space-between);
				@include block-height(0.8rem);
				font-size: $fs24;
				color: $vfLoginMoreTColor;
				margin-top: 0.13rem;
				&_text{
					span{
						margin: 0 12px 0 3px;
						&:first-child{
							margin-left: 0.453333rem;
						}
						img{
							position: absolute;
							top:50%;
							left: 0;
							transform: translateY(-50%);
							width: 0.373333rem;
							height: 0.373333rem;
						}
					}
				}
				&_btn{
					width: 72px;
					@include block-height(28px);
					border: 1px solid $vfUserpColor;
					border-radius: 4px;
					background: $colorWhite;
					// 全色按钮
					&.on{
						background: $vfUserpColor;
						a{
							color: $colorWhite;
							i{
								&:before{
									background: $colorWhite;
								}
								&:after{
									background: $colorWhite;
								}
							}
						}
					}
					a{
						display: block;
						font-size: $fs30;
						color: $vfUserpColor;
						text-align: center;
						// 十字icon
						i{
							position: relative;
							width: 8px;
							height: 8px;
							margin-right: 6px;
							&:before{
								content:'';
								display: block;
								position: absolute;
								top: 50%;
								left: 50%;
								transform: translate(-50%,-50%);
								width: 8px;
								height: 2px;
								background: $vfUserpColor;
							}
							&:after{
								content:'';
								display: block;
								position: absolute;
								top: 50%;
								left: 50%;
								transform: translate(-50%,-50%);
								width: 2px;
								height: 8px;
								background: $vfUserpColor;
							}
						}
					}
				}
			}
		}
		// 文章内容
		&__main{
			margin-top: 0.266667rem;
			p{
				font-size: $fs32;
				color: $vfTitleColor;
				line-height: 0.64rem;
				text-indent: 2em;
				margin: 0.266667rem 0;
				&:first-child{
					text-indent: 0;
					margin: 0;
				}
			}
			img{
				display: block;
				max-width: 100%;
				height: auto;
				margin: 0 auto;
			}
		}
		// 点赞
		&__good{
			width: 100%;
			margin: 0.533333rem 0;
			.good_btn{
				display: block;
				width: 2.106667rem;
				height: 0.773333rem;
				margin: 0 auto;
				line-height: 0.773333rem;
				text-align: center;
				font-size: $fs34;
				color: #999;
				border: 1px solid $vfUserpColor;
				border-radius: 4px;
				svg{
					font-size: $fs34;
					color: $vfUserpColor;
					margin-right: 2px;
				}
			}
		}
		// 其他大V观点详情
		&__otherV{
			.title{
				line-height: 1.066667rem;
				font-size: $fs32;
				color: $vfTitleColor;
				font-weight: normal;
			}
			ul{
				width: 100%;
				margin-top: 0.266667rem;
				li{
					position: relative;
					font-size: $fs32;
					padding-left: 0.16rem;
					line-height: 0.706667rem;
					&:before{
						content:'';
						position: absolute;
						top: 50%;
						left: 0;
						transform: translateY(-50%);
						width: 2px;
						height: 2px;
						border-radius: 50%;
						background: #000;
					}
					a{
						color: $vfTitleColor;
					}
				}
			}
		}
		// 评价列表
		&__evaulate{
			margin-top: 0.266667rem;
			.title{
				line-height: 1.066667rem;
				font-size: $fs32;
				color: $vfTitleColor;
				font-weight: normal;
			}
			.evaulate-list{
				margin-top: 0.4rem;
				.pic{
					float: left;
					width: 50px;
					height: 50px;
					margin-right: 0.4rem;
					overflow: hidden;
					img{
						display: block;
						width: 100%;
						object-fit: cover;
					}
				}
				.info{
					overflow: hidden;
					&-content{
						width: 100%;
						p{
							line-height: 0.533333rem;
							&:nth-child(1){
								font-size: $fs32;
								color: $vfTitleColor;
							}
							&:nth-child(2){
								font-size: $fs24;
								color: $vfLoginMoreTColor;
								margin-top: 0.133333rem;
							}
						}
						.detail{
							width: 100%;
							overflow: hidden;
							span{
								max-width: 1.8rem;
								float: left;
								font-size: $fs24;
								color: $vfLoginMoreTColor;
								margin-right: 0.8rem;
								svg{
									color: $vfTitleColor;
								}
								&:first-child{
									color: $vfTitleColor;
								}
							}
						}
						.return-message{
							position: relative;
							background: #F6F6F6;
							margin-top: 0.233333rem;
							padding: 0.266667rem;
							&.reply{
								padding: 0.133333rem;
								.return-message_list-text{
									width: 100%;
									.input-value{
										float: left;
										width: 82%;
										@include block-height(0.8rem);
										input{
											display: block;
											width: 100%;
											height: .8rem;
											border: 1px solid $borderColor;
											text-indent: 1em;
											font-size: $fs28;
											color: $vfTitleColor;
										}
									}
									.reply-btn{
										overflow: hidden;
										width: 18%;
										a{
											display: block;
											@include block-height(.8rem);
											width: 100%;
											font-size: $fs28;
											color: $vfTitleColor;
											text-align: center;
										}
									}
								}
							}
							&:before{
								content: '';
								position: absolute;
								top: -9px;
								left:2.4rem;
								width:0;
								height:0;
								border-bottom: 10px solid #F6F6F6;
								border-left: 10px solid transparent;
								border-right: 10px solid transparent;
							}
							&_list{
								font-size: $fs28;
								color: $vfTitleColor;
								line-height: 0.533333rem;
								margin-bottom: 0.266667rem;
								&:last-child{
									margin-bottom: 0;
								}
								em{
									&:last-child{
										color: $vfLoginMoreTColor;
									}
								}
							}
						}
					}
				}
			}
		}
	}
}
// 大V关注信息
.V-info{
	background: #F6F6F6;
	&_content{
		padding: 0.533333rem;
		overflow: hidden;
		.V-pic{
			float: left;
			width: 1.866667rem;
			height: 1.866667rem;
			margin-right: 0.266667rem;
			overflow: hidden;
			img{
				width: 100%;;
			}
		}
		.V-info{
			overflow: hidden;
			p{
				font-size: $fs28;
				color: $vfLoginMoreTColor;
				line-height: 0.533333rem;
				margin-top: 0.133333rem;
			}
		}
	}
}
// 底部信息
.detail-footer{
	z-index: 1;
	position: fixed;
	bottom: 0; 
	left: 0;
	right: 0;
	height: 60px;
	background: $colorWhite;
	&_left{
		float: left;
		width: 55%;
		@include block-height(40px);
		font-size: $fs28;
		color: $vfLoginMoreTColor;
		background: #F6F6F6;
		margin-top: 10px;
		margin-left: 10px;
		text-indent: 1em;
	}
	&_right{
		@include flexbox;
		@include justify-content(space-around);
		height: 40px;
		padding-left: 0.266667rem;
		a{
			position: relative;
			display: block;
			@include align-self(center);
			svg{
				color: $vfTitleColor;
				font-size: 0.533333rem;
			}
			p{
				position: absolute;
				top: 0.34rem;
				left: 0.266667rem;
				width: 0.4rem;
				height: 0.4rem;
				line-height: 0.4rem;
				font-size: 0.266667rem;
				text-align: center;
				background: $vfUserpColor;
				border-radius: 50%;
				color: $colorWhite;
			}
		}
	}
}

// 分享
.vf-share{
	z-index: 100;
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	padding: 0.266667rem 0.533333rem;
	background: $colorWhite;
	overflow: hidden;
	ul{
		@include flexbox;
		@include flex-flow(row wrap);
		width: 100%;
		li{
			width: 25%;
			margin-top: 0.533333rem;
			text-align: center;
			a{
				display: block;
				img{
					display: block;
					width: 50px;
					margin: 0 auto;
				}
				p{
					font-size: $fs24;
					color: $vfTextColor;
					line-hight: 0.533333rem;
				}
			}
		}
	}
	.phone-btn{
		margin: 0.533333rem 0;
	}
}